<template>
	<view class="page">
		<view class="head">
			<view class="job-company-info">
				<u-avatar :src="$getImgUrl(companyInfo.LogoImg)" size="100rpx"></u-avatar>
				<view class="job-company-info-content">
					<view class="job-company-info-name">{{ companyInfo.QYName }}</view>
					<view class="job-company-info-auth">
						<u-icon name="/static/job/qy.png" label="普通企业认证" labelPos="right" labelSize="26rpx" labelColor="#e0620d" space="20rpx"></u-icon>
					</view>
				</view>
			</view>
			<view class="job-company-poster">生成海报</view>
		</view>
		<u-gap height="5" bgColor="#f5f5f5"></u-gap>
		<view class="body">
			<view class="job-company-tab">
				<u-tabs
					:list="companySelectList"
					duration="0"
					lineWidth="45"
					lineColor="#c8000a"
					:scrollable="false"
					:itemStyle="{ height: '95rpx', width: '120rpx', flex: '0' }"
					:inactiveStyle="{ color: '#333333', fontWeight: 'bold' }"
					:activeStyle="{ color: '#c8000a', fontWeight: 'bold' }"
					@click="switchChange()"
				>
				</u-tabs>
			</view>
			<u-gap height="2" bgColor="#f5f5f5"></u-gap>
			<view class="job-company-release-list">
				<view class="job-company-position" :style="switchChangeState ? '' : 'display:none;'">
					<HotJobs :hotJobsList="jobsList"></HotJobs>
					<u-loadmore :status="loadMoreStatus" loading-text="努力加载中..." loadmore-text="上拉加载" nomore-text="没有更多信息..." />
				</view>
				<view class="job-company-about" :style="!switchChangeState ? '' : 'display:none;'">
					<view class="job-company-about-item">
						<view class="job-company-about-item-title">
							企业性质：
						</view>
						<view class="job-company-about-item-content">
							{{ companyInfo.XZName }}
						</view>
					</view>
					
					<view class="job-company-about-item">
						<view class="job-company-about-item-title">
							企业规模：
						</view>
						<view class="job-company-about-item-content">
							{{ companyInfo.GMName }} 人
						</view>
					</view>
					
					<view class="job-company-about-item">
						<view class="job-company-about-item-title">
							所属行业：
						</view>
						<view class="job-company-about-item-content">
							{{ companyInfo.HYName }}
						</view>
					</view>
					
					<view class="job-company-about-item">
						<view class="job-company-about-item-title">
							企业地址：
						</view>
						<view class="job-company-about-item-content">
							{{ companyInfo.Address }}
						</view>
					</view>
					
					<view class="job-company-about-item">
						<view class="job-company-about-item-title">
							企业介绍：
						</view>
						<view class="job-company-about-item-content">
							{{ companyInfo.Content }}
						</view>
					</view>
					
					<view class="job-company-about-image">
						<view class="job-company-about-image-title">
							企业图片：
						</view>
						<view class="job-company-about-imagegroup">
							<view class="job-company-about-imagegroup-item" v-for="(item, index) in companyImagesList" :key="index">
								<u--image :showLoading="true" mode="widthFix" :lazyLoad="true" :src="$getImgUrl(item.QYImg)" @click="companyImagePreview(index)" width="100%" height="230rpx"></u--image>
							</view>
							<!-- <view class="job-company-about-imagegroup-item">
								<u--image :showLoading="true" mode="aspectFit" :lazyLoad="true" src="/static/job/name_qy.jpg" width="100%" height="230rpx"></u--image>
							</view>
							<view class="job-company-about-imagegroup-item">
								<u--image :showLoading="true" mode="aspectFit" :lazyLoad="true" src="/static/job/name_qy.jpg" width="100%" height="230rpx"></u--image>
							</view>
							<view class="job-company-about-imagegroup-item">
								<u--image :showLoading="true" mode="aspectFit" :lazyLoad="true" src="/static/job/name_qy.jpg" width="100%" height="230rpx"></u--image>
							</view>
							<view class="job-company-about-imagegroup-item">
								<u--image :showLoading="true" mode="aspectFit" :lazyLoad="true" src="/static/job/name_qy.jpg" width="100%" height="230rpx"></u--image>
							</view>
							<view class="job-company-about-imagegroup-item">
								<u--image :showLoading="true" mode="aspectFit" :lazyLoad="true" src="/static/job/name_qy.jpg" width="100%" height="230rpx"></u--image>
							</view> -->
						</view>
					</view>
					
				</view>
			</view>
			<u-gap height="5" bgColor="#f5f5f5"></u-gap>
		</view>
		<view class="bottom">
			<!-- 最下方盒子用户设置安全高度 -->
		</view>
		<!-- 底部导航菜单开始 -->
		<view class="job-company-float-tabbar u-safe-bottom u-safe-area-inset-bottom">
			<view class="job-company-float-tabbar-home" @click="goHome()">
				<u-icon name="home-fill" color="#c8000a" size="25px" label="首页" labelPos="bottom" labelSize="10px" labelColor="#333333" space="2px"></u-icon>
			</view>
			<view class="job-company-float-tabbar-phone" @click="callPhone()">
				<u-icon name="/static/job/home3.png" size="30rpx" label="电话咨询" labelPos="right" labelSize="26rpx" labelColor="#ffffff" space="10rpx"></u-icon>
			</view>
		</view>
		<!-- 底部导航菜单结束 -->
	</view>
</template>

<script>
import HotJobs from '@/components/HotJobs/HotJobs.vue';
export default {
	data() {
		return {
			companySelectList: [
				{
					name: '招聘职位'
				},
				{
					name: '公司介绍'
				}
			],
			companyId:0, // 公司Id
			loadMoreStatus: 'loading',
			thisPage: 1, // 当前默认翻页
			thisAllPage: 1, //当前全部页面
			jobsList: [], // 职位列表
			companyInfo:{
				LogoImg: '', // 公司图片LOGO
			}, // 公司介绍
			switchChangeState: true, // 招聘职位与公司介绍切换，true时显示招聘职位
			companyImagesList: [], // 企业照片信息列表
		};
	},
	onLoad(option) {
		this.companyId = option.id
		console.log(option)
		this.getJobCompanyShow()
	},
	methods: {
		init() {
			
		},
		getJobCompanyShow() {
			this.$api.getJobCompanyShow({
				openid: getApp().globalData.openid,
				ID: this.companyId,
				page: this.thisPage
			}).then(res => {
				this.jobsList = res.data.ZPList
				this.companyImagesList = res.data.QYPic
				this.loadMoreStatus = 'nomore'
				this.companyInfo = res.data.QYList[0]
				console.log(this.companyInfo)
				
			})
		},
		// 预览图片
		companyImagePreview(index){
			let imagesurl = []
			 this.companyImagesList.forEach((tupianItem) =>{
				 imagesurl.push(this.$getImgUrl(tupianItem.QYImg))
			 })
			 uni.previewImage({
				 current:index,
				 urls:imagesurl,
			 })
		},
		switchChange(item) {
			if(item.index == 0) {
				this.switchChangeState = true
			} else {
				this.switchChangeState = false
			}
			// this.loadMoreStatus = 'loading'
		},
		goHome() {
			uni.$u.route({
				url: 'pages/job/job',
			});
		},
		callPhone() {
			uni.makePhoneCall({
				phoneNumber: this.companyInfo.LXTel 
			});
		},
	},
	components: {
		HotJobs,
	}
};
</script>

<style lang="scss" scoped>
@import url('jobCompany.css');
</style>
